﻿@model int

<div class="mar-hr-10">
    <div class="form-inline">
        <div class="form-group">
            <label class="sr-only" for="if-sq-@Model">Secure Question</label>
            <input type="text" name="SecureQuestion" id="if-sq-@Model" class="form-control" placeholder="Secure Question">
        </div>
        <div class="form-group">
            <label class="sr-only" for="if-sa-@Model">Secure Answer</label>
            <input type="text" name="SecureAnswer" id="if-sa-@Model" class="form-control" placeholder="Secure Answer">
        </div>
        <div class="form-group">
            <a href="#" class="btn btn-link btn-small remove"><i class="fa fa-times text-danger"></i></a>
        </div>
    </div>
</div>

<script type="text/javascript">
    $(".remove").click(function () {
        $(this).parents(".mar-hr-10").remove();

        var count = $("#panel-secq .mar-hr-10").length;
        if (count < 3) {
            $("#btn-add-secq").removeAttr("disabled");
        }
    });
</script>